import React from "react";
import ReactDOM from "react-dom";
import Header from "./components/Header";
import Footer from "./components/Footer";
import { open as _openLogin, close as _closeLogin } from "./components/Login";

export function renderHeader(props = {} as any) {
  const { container } = props;
  ReactDOM.render(<Header />, container || document.querySelector("#header"));
}

export async function unmountHeader(props = {} as any) {
  const { container } = props;
  ReactDOM.unmountComponentAtNode(
    container || document.querySelector("#header")
  );
}

export function renderFooter(props = {} as any) {
  const { container } = props;
  ReactDOM.render(<Footer />, container || document.querySelector("#footer"));
}

export async function unmountFooter(props = {} as any) {
  const { container } = props;
  ReactDOM.unmountComponentAtNode(
    container || document.querySelector("#footer")
  );
}

export const openLogin = _openLogin;
export const closeLogin = _closeLogin;
